<template>
  <div class="audition122">
    <p>GPU: 图形处理器,用于处理图形有关的任务,用于渲染页面</p>
    <p>在css中使用 transform: translateZ(0), opacity, filter 可以开启GPU硬件加速</p>
    <p>硬件加速的工作原理 ：</p>
    <p>浏览器接收到页面文档后，会将文档中的标记语言解析为DOM树。DOM树和CSS<br />结合后形成浏览器构建页面的渲染树。渲染树中包含了大量的渲染元<br />素，每一个渲染元素会被分到一个图层中，每个图层又会被加载到GPU形成渲染纹<br />理，而图层在GPU中 transform 是不会触发 repaint 的，这一点非常类似3D绘<br />图功能，最终这些使用 transform 的图层都会由独立的合成器进程进行处理。</p>
  </div>
</template>

<script>
export default {
  name: 'Audition122'
}
</script>

<style>

</style>